<template>
  <default-layout>
    <header-back text="我的档案" slot="header"></header-back>
    <!--<div class="tab" slot="header">-->
      <!--<span :class="{current: current === 0}" @click="setTab(0)">个人档案</span>-->
      <!--<span :class="{current: current === 1}" @click="setTab(1)">党组织信息</span>-->
      <!--<span :class="{current: current === 2}" @click="setTab(2)">代理信息</span>-->
      <!--<span :class="{current: current === 3}" @click="setTab(3)">户口信息</span>-->
      <!--<span :class="{current: current === 4}" @click="setTab(4)">职称信息</span>-->
    <!--</div>-->
    <loading-text slot="main" v-if="loading"></loading-text>
    <div slot="main" v-if="!loading">
      <file-component :record="record" :file-status="fileStatus"></file-component>
    </div>
    <div class="form-list" slot="main" v-if="!loading && current === 1">
      <div class="form-list-item">
        <div class="label">姓名：</div>
        <div class="content">{{party.aac003}}</div>
      </div>
      <div class="form-list-item">
        <div class="label">档案号：</div>
        <div class="content">{{party.archiveCode}}</div>
      </div>
      <div class="form-list-item">
        <div class="label">身份证号：</div>
        <div class="content">{{party.aac002}}</div>
      </div>
      <div class="form-list-item">
        <div class="label">入党介绍人一：</div>
        <div class="content">{{party.partyintroduce}}</div>
      </div>
      <div class="form-list-item">
        <div class="label">入党介绍人二：</div>
        <div class="content">{{party.partyintroducetwo}}</div>
      </div>
    </div>
    <div class="form-list" slot="main" v-if="!loading && current === 2">
      <div class="form-list-item">
        <div class="label">姓名：</div>
        <div class="content">{{fileInfo.aac003}}</div>
      </div>
      <div class="form-list-item">
        <div class="label">身份证号：</div>
        <div class="content">{{fileInfo.aac002}}</div>
      </div>
      <div class="form-list-item">
        <div class="label">性别：</div>
        <div class="content">{{fileInfo.genderName}}</div>
      </div>
      <div class="form-list-item">
        <div class="label">现居住地址：</div>
        <div class="content">{{fileInfo.aab301}}</div>
      </div>
      <div class="form-list-item">
        <div class="label">籍贯：</div>
        <div class="content">{{fileInfo.aac025}}</div>
      </div>
      <div class="form-list-item">
        <div class="label">出生日期：</div>
        <div class="content">{{fileInfo.aac006}}</div>
      </div>
      <div class="form-list-item">
        <div class="label">毕业院校：</div>
        <div class="content">{{fileInfo.aac180}}</div>
      </div>
      <div class="form-list-item">
        <div class="label">联系电话：</div>
        <div class="content">{{fileInfo.aae005}}</div>
      </div>
      <div class="form-list-item">
        <div class="label">邮箱：</div>
        <div class="content">{{fileInfo.aae015}}</div>
      </div>
      <div class="form-list-item">
        <div class="label">参加工作时间：</div>
        <div class="content">{{fileInfo.expStartJobDate}}</div>
      </div>
    </div>
    <div class="form-list" slot="main" v-if="!loading && current === 3">
      <div class="form-list-item">
        <div class="label">姓名：</div>
        <div class="content">{{account.aac003 || '--'}}</div>
      </div>
    </div>
    <div class="form-list" slot="main" v-if="!loading && current === 4">
      <div class="form-list-item">
        <div class="label">姓名：</div>
        <div class="content">{{edu.aac003}}</div>
      </div>
      <div class="form-list-item">
        <div class="label">单位：</div>
        <div class="content">{{edu.company}}</div>
      </div>
      <div class="form-list-item">
        <div class="label">档案号：</div>
        <div class="content">{{edu.archiveCode}}</div>
      </div>
      <div class="form-list-item">
        <div class="label">身份证号：</div>
        <div class="content">{{edu.aac002}}</div>
      </div>
      <div class="form-list-item">
        <div class="label">最高学历专业：</div>
        <div class="content">{{edu.aac011Profession}}</div>
      </div>
      <div class="form-list-item">
        <div class="label">最高学历毕业年度：</div>
        <div class="content">{{edu.aac011Graduated}}</div>
      </div>
      <div class="form-list-item">
        <div class="label">第一学历专业：</div>
        <div class="content">{{edu.firstDegreeProfession}}</div>
      </div>
      <div class="form-list-item">
        <div class="label">第一学历毕业年度：</div>
        <div class="content">{{edu.firstDegreeGraduated}}</div>
      </div>
    </div>
  </default-layout>
</template>
<script>
  import HeaderBack from '../../../components/header-back/header-back.vue'
  import DefaultLayout from '../../../layouts/default-layout/default-layout'
  import LoadingText from '../../../components/loading-text/loading-text'
  import {mapGetters} from 'vuex'
  import {personalRecord} from '../../../common/js/util'
  import FileComponent from './file-component'

  export default {
    components: {FileComponent, LoadingText, DefaultLayout, HeaderBack},
    computed: {
      ...mapGetters([
        'userInfo'
      ])
    },
    data() {
      return {
        current: 0,
        loading: true,
        record: {},
        fileStatus: '',
        edu: {},
        party: {},
        fileInfo: {},
        account: {}
      }
    },
    methods: {
      setTab(num) {
        this.current = num
        if (num === 0) {
          this.getRecord()
        } else if (num === 1) {
          this.getParty()
        } else if (num === 2) {
          this.getFile()
        } else if (num === 3) {
          this.getAccount()
        } else if (num === 4) {
          this.getEdu()
        }
      },
      getRecord() {
        personalRecord(loading => { this.loading = loading }).then(res => {
          /*
        * 0.（无个人和档案信息）
          1.有预录入信息
          2.档案转出
          3.档案在中心存放
          5.档案借出
          6.档案已通过邮寄到本中心
          7.档案审核没有通过
          0、1、7时可以修改
        * */
          this.record = res.archivesSearchForm
          this.fileStatus = res.status
        })
      },
      getEdu() {
        this.$post('/admin/person/sapi/education/continuing/get/baseInfo', {}, loading => { this.loading = loading }).then(res => {
          this.edu = res.data
        })
      },
      getParty() {
        this.$post('/admin/person/sapi/party/organization/get/audit/status', {}, loading => { this.loading = loading }).then(res => {
          this.party = res.data
        })
      },
      getFile() {
        this.$post('/api/admin/person/sapi/personal/records/perEntry/get/audit/state', {}, loading => { this.loading = loading }).then(res => {
          this.fileInfo = res.data
        })
      },
      getAccount() {
        this.$post('/api/admin/person/sapi/residence/get/info/query', {
          name: this.userInfo.name,
          cardID: this.userInfo.aac002,
          fileNo: this.userInfo.archiveCode
        }, loading => { this.loading = loading }).then(res => {
          this.account = res.data
        })
      }
    },
    created() {
      this.getRecord()
    }
  }
</script>
<style scoped lang="scss">
  @import "../../../common/style/variable";
  .tab{
    border-bottom: 1px solid #ededed;
    background: #fff;
    white-space: nowrap;
    width: 100%;
    overflow-x: auto;
    span{
      padding: .2rem .25rem;
      display: inline-block;
      font-size: .3rem;
      &.current{
        border-bottom: 4px solid $primary;
      }
    }
  }
</style>
